<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<script>
    var socket;
    if (window.WebSocket) {
        socket = new WebSocket("ws://localhost:8899/ws");
        socket.onmessage = function (ev) {
            var tx2 = document.getElementById("text2");
            tx2.value = tx2.value + "\n" + ev.data;
        }

        socket.onopen = function (ev) {
            var tx2 = document.getElementById("text2");
            tx2.value = "链接开启";

        }

        socket.onclose = function (ev) {
            var tx2  = document.getElementById("text2");
            tx2.value =tx2.value + "\n"+ "链接关闭";

        }

    }else{
        alert("不是websocket")
    }

    function send(message) {
        if (!window.WebSocket) {
            return
        }else{
            if (socket.readyState == socket.OPEN) {
                socket.send(message);
            }else{
                alert("链接尚未开启");
            }
        }
    }

</script>
<body>

    <form onsubmit="return false">
        <textarea name="message" id="text1"></textarea>
        <button id="btn1"  onclick="send(this.form.message.value)"></button>

        <textarea id="text2"></textarea>
        <button id="btn2" value="清除消息"></button>
    </form>



</body>
</html>